<template>
	<view class="home">
		<!-- 		<view class="search">
			<uni-section title="基本用法" type="line">
				<uni-search-bar @confirm="search" :focus="true" v-model="searchValue" @blur="blur" @focus="focus"
					@input="input" @cancel="cancel" @clear="clear">
				</uni-search-bar>
			</uni-section>
		</view> -->
		<swiper class="swiper" :indicator-dots="true" :autoplay="false" :interval="2000" :duration="2000">
			<swiper-item class="img-item" v-for="(item,index) in bannerList" :key="index">
				<image class="img-item__img" :src="item.img_url"></image>
			</swiper-item>
		</swiper>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				bannerList: []
			}
		},
		methods: {

		},
		mounted() {
			uni.request({
				url: "http://html5.bjsxt.cn/api/index/banner",
				success: (res) => {
					this.bannerList = res.data.top_banner;
					console.log(this.bannerList);
				}
			})
		}
	}
</script>

<style lang="scss" scoped>
	.home {
		display: flex;
		flex-direction: column;
		flex: 1;
		overflow: hidden;
		.swiper {
			// background-color: red;
			.img-item__img{
				display: block;
				width: 100%;
				height: 100%;
			}
			// .img-item {
			// 	width: 100vw;
			// 	.img-item__img {
			// 		width: 100%;
			// 	}
			// }
		}
	}
</style>
